<template>
  <div>
    <header-top title="班级" />

    <div class="contentF clearfix">
      <!--内容区-->
      <!--    主菜单     -->
      <van-swipe class="banner" :autoplay="3000" indicator-color="white">
        <van-swipe-item class="banner1"></van-swipe-item>
        <van-swipe-item class="banner2"></van-swipe-item>
      </van-swipe>
      <nav class="clearfix">
        <!--    图标切片大小80*80 	-->
        <router-link :to="{path:'/class/noticeList',query:{type:'SCHOOL'}}">
          <div class="nav">
            <i class="classIcon11"></i>
            <p>学校通知</p>
          </div>
        </router-link>
        <router-link :to="{path:'/class/noticeList',query:{type:'CLASS'}}">
          <div class="nav">
            <i class="classIcon12"></i>
            <p>班级通知</p>
          </div>
        </router-link>
        <router-link :to="{path:'/class/noticeList',query:{type:'PAY'}}">
          <div class="nav">
            <i class="classIcon13"></i>
            <p>缴费通知</p>
          </div>
        </router-link>
        <router-link to="/class">
          <div class="nav">
            <i class="classIcon14"></i>
            <p>发布通知</p>
          </div>
        </router-link>
        <router-link to="/class">
          <div class="nav">
            <i class="classIcon10"></i>
            <p>家长留言</p>
          </div>
        </router-link>
        <router-link to="/class/exam">
          <div class="nav">
            <i class="classIcon5"></i>
            <p>成绩查询</p>
          </div>
        </router-link>
        <router-link to="/class/leave">
          <div class="nav">
            <i class="classIcon3"></i>
            <p>学生请假</p>
          </div>
        </router-link>
        <router-link to="/class">
          <div class="nav">
            <i class="classIcon4"></i>
            <p>考勤管理</p>
          </div>
        </router-link>
        <router-link to="/class/task">
          <div class="nav">
            <i class="classIcon9"></i>
            <p>作业发布</p>
          </div>
        </router-link>
        <router-link to="/class">
          <div class="nav">
            <i class="classIcon6"></i>
            <p>离校统计</p>
          </div>
        </router-link>
        <router-link to="/class/book">
          <div class="nav">
            <i class="classIcon2"></i>
            <p>通讯录</p>
          </div>
        </router-link>
        <router-link to="/class/teacherTemplate">
          <div class="nav">
            <i class="classIcon7"></i>
            <p>我的课表</p>
          </div>
        </router-link>
        <router-link to="/class/classTemplate">
          <div class="nav">
            <i class="classIcon15"></i>
            <p>班级课表</p>
          </div>
        </router-link>




      </nav>




    </div>
  </div>
</template>

<script>
  import headerTop from "@/components/headerTop/headerTop";
  export default {
    name:'class',
    data(){
      return{

      }
    },
    components:{
      headerTop:headerTop,
    },
    mounted(){

    },
  }
</script>

<style scoped>
  .banner{ width:100%; height: 8.975rem;}
  .banner1{ background: url("./images/banner.jpg") no-repeat center; background-size: cover;}
  .banner2{ background: url("./images/banner2.jpg") no-repeat center; background-size: cover;}
  nav{ width: 100%; padding: 0  1rem; background: #fff; min-height: 10rem; margin: 0 auto;}
  nav .nav{width: 6rem; height: 6rem; box-sizing: border-box; float: left;  margin: 0.125rem; }
  nav .nav i{display: block;  height: 2.6rem;  margin: 0.7rem 0;background-size: contain; }
  nav .nav p{ height: 1rem; line-height: 1rem; font-size: 1rem; text-align: center;}
  .classIcon2{ background: url("./images/classIcon2.png")no-repeat center; }
  .classIcon3{ background: url("./images/classIcon3.png")no-repeat center; }
  .classIcon4{ background: url("./images/classIcon4.png")no-repeat center; }
  .classIcon5{ background: url("./images/classIcon5.png")no-repeat center; }
  .classIcon6{ background: url("./images/classIcon6.png")no-repeat center; }
  .classIcon7{ background: url("./images/classIcon7.png")no-repeat center; }
  .classIcon9{ background: url("./images/classIcon9.png")no-repeat center; }
  .classIcon10{ background: url("./images/classIcon10.png")no-repeat center; }
  .classIcon11{ background: url("./images/classIcon11.png")no-repeat center; }
  .classIcon12{ background: url("./images/classIcon12.png")no-repeat center; }
  .classIcon13{ background: url("./images/classIcon13.png")no-repeat center; }
  .classIcon14{ background: url("./images/classIcon14.png")no-repeat center; }
  .classIcon15{ background: url("./images/classIcon15.png")no-repeat center; }




</style>
